import { OnInit, Component } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { SheetListService } from './sheet-list.service';
import { SheetQueryCriteria, SongSheet } from '../entity';
import { SongSheetService } from 'src/app/shared';
import { StoreActionService } from 'src/app/store/store-action.service';

@Component({
  selector: 'app-sheet-list',
  templateUrl: './sheet-list.component.html',
  styleUrls: ['./sheet-list.component.less']
})
export class SheetListComponent implements OnInit {

  sheetList: SongSheet[] = [];
  total: number;
  isSheetListLoading = false;

  /** 歌单列表获取参数 */
  pageNum = 1;
  pageSize = 35;
  category = '全部';
  order = 'hot';

  constructor(
    private activatedRoute: ActivatedRoute,
    private sheetListService: SheetListService,
    private songSheetService: SongSheetService,
    private storeActionService: StoreActionService
  ) { }

  ngOnInit(): void {
    this.activatedRoute.data.subscribe(({ sheetData }) => {
      this.sheetList = sheetData.content;
      this.total = sheetData.total;
    });
  }

  onOrderChangeEvent(value: 'hot' | 'new'): void {
    this.pageNum = 1;
    this.order = value;
    this.loadSheets();
  }

  onPlaySheet(songId: number): void {
    this.songSheetService.getSongSheets(songId).subscribe(
      res => {
        this.storeActionService.updatePlayList({ list: res, index: 0 });
      }
    );
  }

  onPageIndexChangeEvent(pageNum: number): void {
    this.pageNum = pageNum;
    this.loadSheets();
  }

  private loadSheets(): void {
    const queryCriteria: SheetQueryCriteria = {
      limit: this.pageSize,
      offset: this.pageNum,
      cat: this.category,
      order: this.order
    };
    this.sheetListService.getSheets(queryCriteria)
      .subscribe(
        res => {
          this.sheetList = res.content;
          this.total = res.total;
        }
      );
  }
}
